<template>
	<view class="layout" v-if="isPopup">
		<image :src="click_to_guide" />

		<view class="layout-main"></view>
	</view>
</template>

<script>
import { defaultImageUrl } from '@/utils';

const click_to_guide = Object.freeze(`${defaultImageUrl}image/click_to_guide.gif`);

export default {
	name: 'Subscription',

	props: {
		isPopup: {
			type: Boolean,
			default: false
		}
	},

	data() {
		return {
			click_to_guide
		};
	},

	onLoad() {},

	methods: {}
};
</script>

<style lang="scss" scoped>
.layout {
	position: fixed;
	top: 0;
	left: 0;
	width: 100vw;
	height: 100vh;
	z-index: 10000;
	background: #333;

	image {
		position: fixed;
		top: 0;
		left: 50%;
		width: 100%;
		height: 750rpx;
		transform: translateX(-50%);
	}

	&-main {
		position: fixed;
		top: 0;
		left: 0;
		width: 100vw;
		height: 100vh;
		z-index: 10000;
		background: rgba(0, 0, 0, 0.2);
	}
}
</style>
